<template>
<view class="">
	<haibao ref="haibao"></haibao>
	<view style="width: 100%;height:64px"></view>
	<view class="bottom" :style="{'padding-bottom': bottom_iphone?20 + 'rpx':''}">
		<view style="display: flex;justify-content: space-around;width: calc(100% - 220px);">
			<button v-if="!isNone" class="sc btn-special" :plain="true" @click="changeSc"><view class="img" ><image v-if="!isSc" src="https://wqq103910.oss-cn-hangzhou.aliyuncs.com/images/4/2020/09/sc.png" mode=""></image><image v-else src="https://wqq103910.oss-cn-hangzhou.aliyuncs.com/images/4/2020/09/sc_a.png" mode=""></image></view><view class="">收藏</view></button>
			<button class="sc btn-special" :plain="true" @click="open"><view class="img" ><image src="https://wqq103910.oss-cn-hangzhou.aliyuncs.com/images/4/2020/09/zf.png" mode=""></image></view><view class="">转发</view></button>
		</view>
		<view class="btn" @click="phone">{{btnName||'投资咨询'}}</view>
	</view>
	<open ref="open" :ishb='typehb>=0?true:false' @showhaibao='showhaibao'></open>
	<!-- <uni-popup ref="pop" type="dialog">
		<uni-popup-dialog ref="inputClose"  mode="input" title="输入内容" value="对话框预置提示内容!"
			placeholder="请输入内容" @confirm="dialogInputConfirm"></uni-popup-dialog>
	</uni-popup> -->
</view>
</template>

<script>
import open from '@/components/open/open.vue'
import haibao from '@/components/haibao/haibao.vue'
	import { gz,hbApi,CreateQrcode} from '@/utils/api.js'
export default {
	props:['type','data','id','typehb','btnName','isNone'],
	data(){
		return{
			bottom_iphone:uni.getStorageSync('bottom')||false,
			isSc:false,
		}
	},
	components:{
		open,
		haibao
	},
	mounted(){
		this.isCheck()
	},
	methods:{
		isCheck(){
			setTimeout(()=>{
				console.log(this.data,this.data.id)
				if(this.data&&this.data.id){
					gz.CheckAttend({identification:this.data.identification||this.data.id,type:this.type}).then(res=>{
						if(res.data.isAttend == 1){
							this.isSc = true
						}else{
							this.isSc = false
						}
					})
				}else{
					this.isCheck()
				}
			},100)
		},
		open(){
			this.$refs.open.show()
		},
		changeSc(){
			if(! JSON.parse(uni.getStorageSync('userinfo')).nickname ){
				uni.showModal({
					title:'提示',
					content:'需完成登录授权后方能收藏',
					success: (res) => {
						if(res.confirm){
							uni.switchTab({
								url:'/pages/my/my'
							})
						}
					},
				})
				return
			}
			gz.AttendAddOrCancel({identification:this.data.identification||this.data.id,type:this.type,
														name:this.data.company_name||this.data.park_name||this.data.policy_name||this.data.name||this.data.title||this.data.city_name,
														}).then(res=>{
				if(res.status==1){
					this.isSc=!this.isSc
				}
			})
		},
		showhaibao(){
			if(! JSON.parse(uni.getStorageSync('userinfo')).nickname ){
				uni.showModal({
					title:'提示',
					content:'需完成登录授权后方能收藏',
					success: (res) => {
						if(res.confirm){
							uni.switchTab({
								url:'/pages/my/my'
							})
						}
					},
				})
				return
			}
			uni.showLoading({ mask:true,title:'海报制作中'})
			CreateQrcode({type:this.typehb,id:this.data.identification||this.data.id}).then(res=>{
				uni.hideLoading()
				if(res.status==0){
					uni.showToast({
						title:'海报制作失败...'
					})
					return
				}
				this.$refs.haibao.show(res.data.qrcode)
			})
		},
		phone(){
			uni.makePhoneCall({
					phoneNumber: this.data.tel||this.data.mobile||this.data.elephone||'400-962-5108' //仅为示例
			});
		},
	}
}
</script>

<style scoped lang="scss">
	.btn-special{
		margin: 0 !important;
		// margin-bottom: 2px !important;
		padding: 0 !important;
		background-color: #fff !important;
		// height: 22px !important;
		// line-height: 20px !important;
		border:none !important;
	}
.bottom{
	position: fixed;
	justify-content: space-around;
	align-items: center;
	bottom: 0;
	width: 100% ;
	// padding: 0 10px;
	height: 54px;
	background: #FFFFFF;
	display: flex;
	z-index: 100;
	box-shadow: 0px -2px 2px #e7e7e7;
	.btn{
		font-size: 18px;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #FFFFFF;
		text-align: center;
		height: 44px;
		line-height: 44px;
		background: linear-gradient(90deg, #40A9FF99 0%, #279aff 100%);
		border-radius: 22px;
		width: 180px;
	}
	.sc{
		font-size: 12px;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #999;
		text-align: center;	
		// width: ;
		position: relative;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		line-height: 16px;
		.img{
			width: 24px;
			height: 24px;
		}
		image{
			width: 24px;
			height: 24px;
		}
		.num{
			position: absolute;
			font-size: 12px;
			background-color: red;
			height: 14px;
			line-height: 14px;
			border-radius: 7px;
			padding: 0 4px;
			color: #fff;
			right: -5px;
			top: -5px;
		}
	}
}
.pl_item{
	display: flex;
	margin: 10px 16px;
	width: calc(100% - 32px);
	.tx{
		width: 24px;
		height: 24px;
		margin-right: 10px;
	}
	.r{
		width: calc(100% - 34px);
		padding-bottom:10px;
		border-bottom: 1px solid #E9EBEE;
		.top{
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin-bottom: 10px;
			.name{
				font-size: 14px;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #507DAF;
			}
			.time{
				font-size: 14px;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #999999;
			}
		}
		.content{
			padding-top:10px;
			font-size: 16px;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #333333;
		}
	}
}
.title_pj{
	font-size: 18px;
	font-family: PingFangSC-Medium, PingFang SC;
	font-weight: 500;
	color: #333333;
	line-height: 25px;
	margin: 16px;
	width: calc(100% - 32px);
	display: flex;
	justify-content: space-between;
	.right{
		display: flex;
		align-items: center;
			image{ 
				width: 15px;
				margin-right: 5px;
			}
			font-size: 14px;
			font-weight: 400;
			color: #FF5100;
	}
}
.userinfo{
	position:fixed;
	bottom:0;
	z-index:1000;
	display:flex;
	align-items:center;
	background:#ff9933;
	color: #fff;
	padding:15px 20px;
	width:calc(100% - 40px);
	box-shadow: 0 -2px 2px 0 rgba(0,0,0,0.2);
	.img111{
		width:42px;
		height:42px;
		border-radius:21px;
		margin-right:20px;
	}
	.btn{
		position:absolute;
		right:30px;
		border-radius:4px;
		padding:4px 8px;
		background:#fff;
		color:#ff9933;
	}
	.img1{
		position:absolute;
		right:0;
		top:-5px;
		height:18px;
		width:18px;
	}
}
</style>